﻿@using PerpetuumSoft.Knockout
@using ContractorTimesheet.DataModel 
@using ContractorTimesheet.Infrastructure

@model ContractorTimesheet.Models.HolidayEditorModel

@{
    var ko = Html.CreateKnockoutContext();

    User loginUser = CurrentSession.User;
}

<h2>Holidays</h2>

<form id="myform">
    <div>
        <table border="0" width="100%">
            <tbody>
                <tr>
                    <td colspan="5">
                        <hr />
                    </td>
                </tr>
                @if (loginUser != null && loginUser.IsAdmin)
                {
                    <tr>
                        <td height="30" width="15%">
                            <input type="text" name="newYear" placeholder="YYYY" @ko.Bind.Value(m => m.NewYear) />
                        </td>
                        <td width="15%">
                            <input type="text" name="newMonth" placeholder="MM" @ko.Bind.Value(m => m.NewMonth) />
                        </td>
                        <td width="15%">
                            <input type="text" name="newDay" placeholder="DD" @ko.Bind.Value(m => m.NewDay) />
                        </td>
                        <td width="30%">
                            <input type="text" name="newDescription" size="100" placeholder="Description" @ko.Bind.Value(m => m.NewDescription) />
                        </td>
                        <td align="center">
                            <button type="submit">Add</button>
                        </td>
                    </tr>
                }
                else
                {
                    <tr>
                        <td height="30" width="15%">
                            Year
                        </td>
                        <td width="15%">
                            Month
                        </td>
                        <td width="15%">
                            Day
                        </td>
                        <td width="30%">
                            Description
                        </td>
                        <td align="center">
                            &nbsp;
                        </td>
                    </tr>
                }
                <tr>
                    <td colspan="5">
                        <hr />
                    </td>
                </tr>
                @using (var holiday = ko.Foreach(m => m.Holidays))
                {
                    <tr>
                        <td height="30">
                            @holiday.Html.Span(m => m.Year)
                        </td>
                        <td>
                            @holiday.Html.Span(m => m.Month)
                        </td>
                        <td>
                            @holiday.Html.Span(m => m.Day)
                        </td>
                        <td>
                            @holiday.Html.Span(m => m.Description)
                        </td>
                        <td align="center">
                            @if (loginUser != null && loginUser.IsAdmin)
                            {
                                @holiday.Html.HyperlinkButton("Delete", "DeleteHoliday", "Holidays", new { index = @holiday.GetIndex() })
                            }
                        </td>
                    </tr>
                }
            </tbody>
        </table>
    </div>
</form>

<script type="text/javascript">
    $(document).ready(function () {
        $("#myform").ajaxForm();
        $("#myform").validate({
            rules: {
                newYear: { required: true, number: true, minlength: 4, maxlength: 4, range: [2014, 2024] },
                newMonth: { required: true, number: true, minlength: 2, maxlength: 2, range: [1, 12] },
                newDay: { required: true, number: true, minlength: 2, maxlength: 2, range: [1, 31] },
                newDescription: { required: true, maxlength: 100 }
            },
            messages: {
                newYear: { required: '', number: '', minlength: '', maxlength: '', range: '' },
                newMonth: { required: '', number: '', minlength: '', maxlength: '', range: '' },
                newDay: { required: '', number: '', minlength: '', maxlength: '', range: '' },
                newDescription: { required: '', maxlength: '' }
            },
            submitHandler: function () { @ko.ServerAction("AddHoliday", "Holidays"); }
        });
    });
</script>

@ko.Apply(Model)
